<template>
  <div class="familyUpdate">
    <el-form :model="familyData" status-icon ref="familyData" :rules="familyRules" class="demo-ruleForm" label-position="top">
      <el-row :gutter="150">
        <el-col :span="24">
          <h2 class="titleH">家庭信息</h2>
        </el-col>
        <el-col :span="8">
          <el-form-item label="在读学生数" prop="inSchoolNum">
            <el-input size="small" type="text" v-model="familyData.inSchoolNum" autocomplete="off" maxlength="2"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="近亲或邻居联系人" prop="neighborName">
            <el-input size="small" type="text" v-model="familyData.neighborName" autocomplete="off" maxlength="8"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="关系" prop="relation">
            <el-input size="small" type="text" v-model="familyData.relation" autocomplete="off" maxlength="8"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="近亲或邻居地址" prop="neighborAddress">
            <el-input size="small" type="text" v-model="familyData.neighborAddress" autocomplete="off"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="近亲或邻居联系电话" prop="neighborPhone">
            <el-input size="small" type="text" v-model="familyData.neighborPhone" autocomplete="off"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="近亲或邻居所在地邮编" prop="neighPostcode">
            <el-input size="small" type="text" v-model="familyData.neighPostcode" autocomplete="off"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <h2 class="titleH">家庭经济情况</h2>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否单亲" prop="isSingle">
            <el-select v-model="familyData.isSingle" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否孤儿" prop="isOrphan">
            <el-select v-model="familyData.isOrphan" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.isOrphan" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否残疾" prop="isDisability">
            <el-select v-model="familyData.isDisability" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.isDisability" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否烈士子女" prop="isMartyr">
            <el-select v-model="familyData.isMartyr" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.isMartyr" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否五保户" prop="isRuralInfirm">
            <el-select v-model="familyData.isRuralInfirm" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.isRuralInfirm" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否父母丧失劳动能力" prop="isParentLostAbilityWork">
            <el-select v-model="familyData.isParentLostAbilityWork" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.isParentLostAbilityWork" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否办理生源地贷款" prop="isSourcePlaceLoan">
            <el-select v-model="familyData.isSourcePlaceLoan" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.isSourcePlaceLoan" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否在当地建立档案卡" prop="isFilingCard">
            <el-select v-model="familyData.isFilingCard" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.isFilingCard" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否家庭中有大病患者" prop="isFamilySeriousIllness">
            <el-select v-model="familyData.isFamilySeriousIllness" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.isFamilySeriousIllness" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否残疾人子女" prop="isParentDisabled">
            <el-select v-model="familyData.isParentDisabled" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.isParentDisabled" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="残疾类别" prop="disabledType">
            <el-select v-model="familyData.disabledType" size="small">
                <el-option label="无" value="无"></el-option>
              <el-option v-for="(item,index) in disabledTypeOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.disabledType" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="上次贫困状况" prop="lastPovertySituation">
            <el-input size="small"  type="text" v-model="familyData.lastPovertySituation" autocomplete="off"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="当前状态" prop="currentState">
            <el-input size="small"  type="text" v-model="familyData.currentState" autocomplete="off"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否低收入家庭" prop="isLowIncomeFamily">
            <el-select v-model="familyData.isLowIncomeFamily" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.isLowIncomeFamily" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="家庭月总收入" prop="monthIncomeFamily">
            <el-input size="small" type="text" v-model="familyData.monthIncomeFamily" autocomplete="off" maxlength="7"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="收入来源" prop="sourceIncome">
            <el-select v-model="familyData.sourceIncome" size="small">
              <el-option v-for="(item,index) in sourceIncomeOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <!-- <el-input size="small" disabled type="text" v-model="familyData.sourceIncome" autocomplete="off"></el-input> -->
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="赡养人口数" prop="supportNumber">
            <el-input size="small" type="text" v-model="familyData.supportNumber" autocomplete="off" maxlength="2"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="失业人数（务农不算失业）" prop="unemployment">
            <el-input size="small" type="text" v-model="familyData.unemployment" autocomplete="off" maxlength="2"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="家庭可提供月生活费" prop="monthlyCost">
            <el-input size="small" type="text" v-model="familyData.monthlyCost" autocomplete="off" maxlength='5'></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="家庭负债情况" prop="familyLiabilities">
            <el-input size="small" type="text" v-model="familyData.familyLiabilities" autocomplete="off" maxlength="7"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="家庭负债原因" prop="familyLiabilitiesReason">
            <el-input size="small" type="text" v-model="familyData.familyLiabilitiesReason" autocomplete="off" maxlength='30'></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否农村特困供养" prop="isRuralSpecialPovertySupport">
            <el-select v-model="familyData.isRuralSpecialPovertySupport" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="家庭人均年收入" prop="familyYearIncome">
            <el-input size="small" type="text" v-model="familyData.familyYearIncome" autocomplete="off" maxlength='7'></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="家庭劳动人口数（学生不算劳动人口）" prop="familyWorkNumber">
            <el-input size="small" type="text" v-model="familyData.familyWorkNumber" autocomplete="off" maxlength='2'></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否预计校园地助学贷款" prop="isPlanSchoolPlaceLoan">
            <el-select v-model="familyData.isPlanSchoolPlaceLoan" size="small">
              <el-option v-for="(item,index) in yesOrNoOptions" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="手机品牌" prop="phoneBrand">
            <el-input size="small" type="text" v-model="familyData.phoneBrand" autocomplete="off" maxlength='10'></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="手机价格" prop="phonePrice">
            <el-input size="small" type="text" v-model="familyData.phonePrice" autocomplete="off" maxlength='5'></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="电脑品牌" prop="computerBrand">
            <el-input size="small" type="text" v-model="familyData.computerBrand" autocomplete="off" maxlength='10'></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="电脑价格" prop="computerPrice">
            <el-input size="small" type="text" v-model="familyData.computerPrice" autocomplete="off" maxlength='5'></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="家庭情况说明" prop="familySituationStatement">
            <el-input size="small" type="textarea" :rows="4" v-model="familyData.familySituationStatement" autocomplete="off" maxlength="200"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="其他重大情况" prop="otherImportantSituation">
            <el-input size="small" type="textarea" :rows="4" v-model="familyData.otherImportantSituation" autocomplete="off" maxlength="800"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="家庭是否遭受突发意外事件" :prop="familyData.isAccident==1?'accidentSituation':'isAccident'">
            <el-radio-group v-model.number="familyData.isAccident" @change="addOrdelThisRule('accidentSituation','isAccident')">
              <el-radio :label="1">是</el-radio>
              <el-radio :label="0">否</el-radio>
            </el-radio-group>
            <el-input size="small" v-if="familyData.isAccident==1" :rows="4" type="textarea" v-model="familyData.accidentSituation" autocomplete="off" maxlength="800"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="近三年家庭是否遭受自然灾害" :prop="familyData.isNaturalDisaster==1?'naturalDisasterSituation':'isNaturalDisaster'">
            <el-radio-group v-model="familyData.isNaturalDisaster" @change="addOrdelThisRule('naturalDisasterSituation', 'isNaturalDisaster')">
              <el-radio :label="1">是</el-radio>
              <el-radio :label="0">否</el-radio>
            </el-radio-group>
            <el-input size="small" v-if="familyData.isNaturalDisaster==1" :rows="4" type="textarea" v-model="familyData.naturalDisasterSituation" autocomplete="off" maxlength="800"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-row>
      <el-col :span="12" style="height:40px;">
        <h2 class="titleH">家庭成员信息</h2>
      </el-col>
      <el-col :span="12" style="height:40px;" align="right">
        <el-button type="primary" size="small" @click="addFamilyMember">新增</el-button>
      </el-col>
      <el-col :span='24'>
      <el-form ref="familyTable" :model="{familyTableData:familyTableData}">
        <el-table :data="familyTableData" style="width: 100%">
          <el-table-column label="序号" width="50">
            <template slot-scope="scope">
              {{scope.$index+1}}
            </template>
          </el-table-column>
          <el-table-column prop="name" label="姓名">
            <template slot-scope="scope">
              <el-form-item
                    v-if="scope.row.isUpdateFlag"
                    style="height:55px;margin-bottom:0"
                    :prop="'familyTableData[' + scope.$index + '].name'"
                    :rules="{
                      required: true, message: '请填入姓名', trigger: 'blur'
                    }"
                  >
              <el-input maxlength="40"  size="small" v-model="scope.row.name"></el-input>
              </el-form-item>
              <span v-else>{{scope.row.name}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="relation" label="关系">
            <template slot-scope="scope">
              <el-form-item
                    v-if="scope.row.isUpdateFlag"
                    style="height:55px;margin-bottom:0"
                    :prop="'familyTableData[' + scope.$index + '].relation'"
                    :rules="{
                      required: true, message: '请填与其关系', trigger: 'blur'
                    }"
                  >
              <el-input maxlength="6" v-if="scope.row.isUpdateFlag" size="small" v-model="scope.row.relation"></el-input>
              </el-form-item>
              <span v-else>{{scope.row.relation}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="politicStatus" label="政治面貌">
            <template slot-scope="scope">
              <el-form-item
                    v-if="scope.row.isUpdateFlag"
                    style="height:55px;margin-bottom:0"
                    :prop="'familyTableData[' + scope.$index + '].politicStatus'"
                    :rules="{
                      required: true, message: '请填政治面貌', trigger: 'blur'
                    }"
                  >
              <el-input maxlength="6" v-if="scope.row.isUpdateFlag" size="small" v-model="scope.row.politicStatus"></el-input>
              </el-form-item>
              <span v-else>{{scope.row.politicStatus}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="birthDate" label="出生日期" width="150">
            <template slot-scope="scope">
              <el-form-item
                    v-if="scope.row.isUpdateFlag"
                    style="height:55px;margin-bottom:0"
                    :prop="'familyTableData[' + scope.$index + '].birthDate'"
                    :rules="{
                      required: true, message: '请填入出生日期', trigger: 'blur'
                    }"
                  >
              <el-date-picker size="small" style="width:100%"  v-model="scope.row.birthDate" type="date" placeholder="选择日期">
              </el-date-picker>
              </el-form-item>
              <span v-else>{{scope.row.birthDate}}</span>
            </template>
          </el-table-column>

          <el-table-column width="150px" prop="phone" label="联系电话">
            <template slot-scope="scope">
              <el-form-item
                    v-if="scope.row.isUpdateFlag"
                    style="height:55px;margin-bottom:0"
                    :prop="'familyTableData[' + scope.$index + '].phone'"
                    :rules="[{
                      required: true, message: '请输入正确的联系电话', trigger: 'blur'
                    }, {validator: checkPhone, trigger: 'blur'}]"
                  >
              <el-input maxlength="11" v-if="scope.row.isUpdateFlag" size="small" v-model="scope.row.phone"></el-input>
              </el-form-item>
              <span v-else>{{scope.row.phone}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="workCompany" label="学习/工作单位">
            <template slot-scope="scope">
              <el-form-item
                    v-if="scope.row.isUpdateFlag"
                    style="height:55px;margin-bottom:0"
                    :prop="'familyTableData[' + scope.$index + '].workCompany'"
                    :rules="{
                      required: true, message: '请输入学习/工作单位', trigger: 'blur'
                    }"
                  >
              <el-input maxlength="50" v-if="scope.row.isUpdateFlag" size="small" v-model="scope.row.workCompany"></el-input>
              </el-form-item>
              <span v-else>{{scope.row.workCompany}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="monthlyIncome" label="月收入">
            <template slot-scope="scope">
              <el-form-item
                    v-if="scope.row.isUpdateFlag"
                    style="height:55px;margin-bottom:0"
                    :prop="'familyTableData[' + scope.$index + '].monthlyIncome'"
                    :rules="[{
                      required: true, message: '请输月收入', trigger: 'blur'
                    },{validator: checkMoney, trigger: 'blur'}]"
                  >
              <el-input type="text" maxlength="20" v-if="scope.row.isUpdateFlag" size="small" v-model="scope.row.monthlyIncome"></el-input>
              </el-form-item>
              <span v-else>{{scope.row.monthlyIncome}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="healthStatus" label="健康状况">
            <template slot-scope="scope">
              <el-form-item
                    v-if="scope.row.isUpdateFlag"
                    style="height:55px;margin-bottom:0"
                    :prop="'familyTableData[' + scope.$index + '].healthStatus'"
                    :rules="{
                      required: true, message: '请选择健康状况', trigger: 'blur'
                    }"
                  >
              <el-select size='small' v-model="scope.row.healthStatus" placeholder="健康状况" >
                <el-option  label="健康" value="健康"></el-option>
                <el-option  label="特异体质" value="特异体质"></el-option>
              </el-select>
              </el-form-item>
              <span v-else>{{scope.row.healthStatus}}</span>
            </template>
          </el-table-column>
          <el-table-column label="操作" width="100">
            <template slot-scope="scope">
              <el-button style="margin-bottom:14px;" type="text" size="small" v-if="scope.row.isUpdateFlag" @click="updateOrSaveFamilyMember(scope)">保存</el-button>
              <el-button style="margin-bottom:14px;" type="text" size="small" v-else @click="scope.row.isUpdateFlag=1">修改</el-button>
              <el-button  type="text" style="color:red;margin-bottom:14px;" size="small" @click="delCurrentFamily(scope)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-form>
      </el-col>
      <el-col :span="24" align="center" style="margin:30px 0px;">
        <el-button @click="resetForm('familyData')">取消</el-button>
        <el-button type="primary" @click="submitForm('familyData')">保存</el-button>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import {school as schoolService, student as studentService} from '@api/index'
import updateFamily from '@/pages/main/components/updateFamily'
import { isMobilePhone } from '@/tools/utils'
export default {
  name: 'familyUpdate',
  data () {
    let validatorNumberIncludeZero = (rule, value, callback) => {
      let pattern = /^\d+$/
      // let floatNum = /^[0-9]+(.[0-9]{1,5})?$/
      if (pattern.test(value)) {
        callback()
      } else {
        callback(new Error())
      }
    }
    let addressValidator = (rule, value, callback) => {
      let pattern = new RegExp("[`~!@#$^&*=|{}':;',\\[\\].<>/?~！@#￥……&*|{}【】><》《‘；：”“'。，、？]")
      let pattern2 = /\S/
      if (!pattern.test(value) && pattern2.test(value)) {
        callback()
      } else {
        callback(new Error())
      }
    }
    let phoneValidator = (rule, value, callback) => {
      let pattern = /^1(3|4|5|7|8|9)\d{9}$/
      // eslint-disable-next-line
      let parrern2 = /^(([0\+]\d{2,3}-)?(0\d{2,3})-)?(\d{7,8})(-(\d{3,}))?$/
      if (pattern.test(value) || parrern2.test(value)) {
        callback()
      } else {
        callback(new Error())
      }
    }
    let postCodeValidator = (rule, value, callback) => {
      let pattern = /^\d{6}$/
      if (pattern.test(value)) {
        callback()
      } else {
        callback(new Error())
      }
    }
    let validatorNumber = (rule, value, callback) => {
      let pattern = /^[1-9]*[1-9][0-9]*$/
      // let floatNum = /^[0-9]+(.[0-9]{1,5})?$/
      if (pattern.test(value)) {
        callback()
      } else {
        callback(new Error())
      }
    }
    let disabledTypeValidator = (rule, value, callback) => {
      if (value === undefined) {
        callback(new Error())
      } else {
        callback()
      }
    }
    let familyLiabilitiesReasonValidator = (rule, value, callback) => {
      if (!value) {
        callback(new Error('请输入家庭负债原因'))
      } else if (value.length > 30) {
        callback(new Error('家庭负债原因字符数不能大于30'))
      } else {
        callback()
      }
    }

    let checkPhone = (rule, value, callback) => {
      if (!isMobilePhone(value)) {
        callback(new Error('请输入正确的联系电话'))
      } else {
        callback()
      }
    }

    let checkMoney = (rule, value, callback) => {
      const reg = /^[1-9]\d*$/
      if (!reg.test(value)) {
        callback(new Error('请输入正整数'))
      } else {
        callback()
      }
    }

    return {
      userType: this.$store.state.user.type,
      checkPhone,
      checkMoney,
      formSaveTimer: null,
      sn: this.$route.query.sn || this.$store.state.user.id,
      yesOrNoOptions: [
        {label: '是', value: 1},
        {label: '否', value: 0}
      ],
      disabledTypeOptions: [
        {label: '视力残疾', value: '视力残疾'},
        {label: '听力残疾', value: '听力残疾'},
        {label: '智力残疾', value: '智力残疾'},
        {label: '其他残疾', value: '其他残疾'}
      ],
      sourceIncomeOptions: [
        {label: '工资', value: '工资'},
        {label: '奖金', value: '奖金'},
        {label: '津贴', value: '津贴'},
        {label: '补贴和其他劳动收入', value: '补贴和其他劳动收入'},
        {label: '自谋职业收入', value: '自谋职业收入'},
        {label: '其他', value: '其他'}
      ],
      familyRules: {
        population: [
          { required: false, message: '请输入家庭人口数', trigger: 'blur' },
          { min: 1, max: 2, message: '请输入正确家庭人口数', trigger: 'blur', validator: validatorNumber }
        ],
        relation: [ { required: true, message: '请输入与其关系', trigger: 'blur' } ],
        inSchoolNum: [
          { required: false, message: '请输入家庭在读学生数', trigger: 'blur' },
          { min: 1, max: 2, message: '请输入正确家庭在读学生数', trigger: 'blur', validator: validatorNumberIncludeZero }
        ],
        homeAddress: [
          { required: false, message: '请输入家庭地址', trigger: 'blur' },
          { message: '请输入正确家庭地址', trigger: 'blur', validator: addressValidator }
        ],
        homePhone: [
          { required: false, message: '请输入家庭联系电话', trigger: 'blur' },
          { message: '请输入正确家庭联系电话', trigger: 'blur', validator: phoneValidator }
        ],
        homePostcode: [
          { required: false, message: '请输入家庭所在邮编', trigger: 'blur' },
          { message: '请输入正确所在邮编', trigger: 'blur', validator: postCodeValidator }
        ],
        neighborName: [
          { required: true, message: '请输入近亲或邻居联系人', trigger: 'blur' },
          { message: '请输入正确近亲或邻居联系人', trigger: 'blur', validator: addressValidator }
        ],
        neighborAddress: [
          { required: true, message: '请输入近亲或邻居地址', trigger: 'blur' },
          { message: '请输入正确近亲或邻居地址', trigger: 'blur', validator: addressValidator }
        ],
        neighborPhone: [
          { required: true, message: '请输入近亲或邻居联系电话', trigger: 'blur' },
          { message: '请输入正确近亲或邻居联系电话', trigger: 'blur', validator: phoneValidator }
        ],
        neighPostcode: [
          { required: true, message: '请输入近亲或邻居所在地邮编', trigger: 'blur' },
          { message: '请输入正确所在邮编', trigger: 'blur', validator: postCodeValidator }
        ],
        isSingle: [
          { required: false, message: '请选择是否单亲', trigger: ['blur', 'change'] }
        ],
        isOrphan: [
          { required: false, message: '请选择是否孤儿', trigger: ['blur', 'change'] }
        ],
        isDisability: [
          { required: false, message: '请选择是否残疾', trigger: ['blur', 'change'] }
        ],
        isMartyr: [
          { required: false, message: '请选择是否烈士子女', trigger: ['blur', 'change'] }
        ],
        isRuralInfirm: [
          { required: false, message: '请选择是否五保户', trigger: ['blur', 'change'] }
        ],
        isLowField: [
          { required: false, message: '请选择是否低保', trigger: ['blur', 'change'] }
        ],
        isParentLostAbilityWork: [
          { required: false, message: '请选择是否父母丧失劳动能力', trigger: ['blur', 'change'] }
        ],
        isSourcePlaceLoan: [
          { required: false, message: '请选择是否办理生源地贷款', trigger: ['blur', 'change'] }
        ],
        isFilingCard: [
          { required: false, message: '请选择是否在当地建立档案卡', trigger: ['blur', 'change'] }
        ],
        isFamilySeriousIllness: [
          { required: false, message: '请选择是否家庭中有大病患者', trigger: ['blur', 'change'] }
        ],
        isParentDisabled: [
          { required: false, message: '请选择是否残疾人子女', trigger: ['blur', 'change'] }
        ],
        disabledType: [
          { required: false, message: '请选择残疾类别', trigger: ['blur', 'change'], validator: disabledTypeValidator }
        ],
        isLowIncomeFamily: [
          { required: false, message: '请选择是否低收入家庭', trigger: ['blur', 'change'] }
        ],
        monthIncomeFamily: [
          { required: false, message: '请输入家庭总收入', trigger: 'blur' },
          { message: '请输入正确家庭总收入', trigger: 'blur', validator: validatorNumberIncludeZero }
        ],
        sourceIncome: [
          { required: false, message: '请选择收入来源', trigger: ['blur', 'change'] }
        ],
        supportNumber: [
          { required: false, message: '请输入赡养人口数', trigger: 'blur' },
          { message: '请输入正确赡养人口数', trigger: 'blur', validator: validatorNumberIncludeZero }
        ],
        unemployment: [
          { required: false, message: '请输入失业人数', trigger: 'blur' },
          { message: '请输入正确失业人数', trigger: 'blur', validator: validatorNumberIncludeZero }
        ],
        monthlyCost: [
          { required: false, message: '请输入家庭可提供月生活费', trigger: 'blur' },
          { message: '请输入家庭可提供月生活费', trigger: 'blur', validator: validatorNumberIncludeZero }
        ],
        familyLiabilities: [
          { required: false, message: '请输入家庭负债情况', trigger: 'blur' },
          { message: '请输入正确家庭负债情况', trigger: 'blur', validator: validatorNumberIncludeZero }
        ],
        familyLiabilitiesReason: [
          { required: false, message: '请输入家庭负债原因', trigger: 'blur' },
          { trigger: 'blur', validator: familyLiabilitiesReasonValidator }
        ],
        isRuralSpecialPovertySupport: [
          { required: false, message: '请选择是否农村特困供养', trigger: ['blur', 'change'] }
        ],
        familyYearIncome: [
          { required: false, message: '请输入家庭人均年收入', trigger: 'blur' },
          { message: '请输入正确家庭人均年收入', trigger: 'blur', validator: validatorNumberIncludeZero }
        ],
        familyWorkNumber: [
          { required: false, message: '请输入家庭劳动人口数', trigger: 'blur' },
          { message: '请输入正确家庭劳动人口数', trigger: 'blur', validator: validatorNumberIncludeZero }
        ],
        isPlanSchoolPlaceLoan: [
          { required: false, message: '请选择是否预计校园地助学贷款', trigger: ['blur', 'change'] }
        ],
        phoneBrand: [
          { required: false, message: '请输入手机品牌', trigger: 'blur' },
          { message: '请输入正确手机品牌', trigger: 'blur', validator: addressValidator }
        ],
        phonePrice: [
          { required: false, message: '请输入手机价格', trigger: 'blur' },
          { message: '请输入正确手机价格', trigger: 'blur', validator: validatorNumberIncludeZero }
        ],
        computerBrand: [
          { required: false, message: '请输入电脑品牌', trigger: 'blur' },
          { message: '请输入正确电脑品牌', trigger: 'blur', validator: addressValidator }
        ],
        computerPrice: [
          { required: false, message: '请输入电脑价格', trigger: 'blur' },
          { message: '请输入正确电脑价格', trigger: 'blur', validator: validatorNumberIncludeZero }
        ],
        familySituationStatement: [
          { required: false, message: '请输入家庭情况说明', trigger: 'blur' }
        ],
        otherImportantSituation: [
          { required: false, message: '请输入其他重大情况', trigger: 'blur' }
        ],
        isAccident: [
          { required: false, message: '请选择家庭是否遭受突发意外事件', trigger: 'change' }
        ],
        isNaturalDisaster: [
          { required: false, message: '请选择近三年家是否庭遭受自然灾害', trigger: 'change' }
        ],
        accidentSituation: [],
        naturalDisasterSituation: []
      }
    }
  },
  components: {
    'xd-updateFamily': updateFamily
  },
  props: ['familyData', 'familyTableData'],
  watch: {},
  mounted () {
    console.log(this.$store.state)
    // getFormDataLocal('updateFamily', 'sn', this.familyData, ['lastPovertySituation', 'currentState'])
    this.initPage()
    // this.formSaveTimer = setInterval(() => {
    //   // this.$alert('表单信息已保存至本地，下次进入将自动加载', '提示', {
    //   //   confirmButtonText: '确定'})
    //   saveFormDataLocal('updateFamily', this.familyData)
    // }, 1000 * 60 * 3)
  },
  destroyed () {
    clearInterval(this.formSaveTimer)
  },
  methods: {
    filterIsOrNot (OBJ) {
      let params = {}
      if (OBJ) {
        Object.keys(OBJ).forEach(key => {
          if (key !== 'monthIncome' && key !== 'sourceIncome' && key !== 'supportPersonNum' && key !== 'lostWorkPersonNum' && key !== 'phoneMoney') {
            if (OBJ[key] === 1) {
              params[key] = '是'
            } else if (OBJ[key] === 0) {
              params[key] = '否'
            } else {
              params[key] = OBJ[key]
            }
          } else {
            params[key] = OBJ[key]
          }
        })
      }
      return params
    },
    initPage () {
      // 1：学生；3：学校用户,4：年级辅导员,5 ：学院用户：
      if (this.userType === 1) {

      } else {

      }
    },
    // 新增家庭成员
    addFamilyMember () {
      let params = {
        'birthDate': null,
        'healthStatus': null,
        'id': null,
        'monthlyIncome': null,
        'name': null,
        'phone': null,
        'relation': null,
        'workCompany': null,
        'politicStatus ': null,
        'isUpdateFlag': 2 // 0不修改；1修改；2新增
      }
      this.familyTableData.push(params)
    },
    // 修改新增保存家庭成员信息
    updateOrSaveFamilyMember (rowData) {
      let params = {
        'birthDate': rowData.row.birthDate,
        'healthStatus': rowData.row.healthStatus,
        'monthlyIncome': rowData.row.monthlyIncome,
        'name': rowData.row.name,
        'phone': rowData.row.phone,
        'relation': rowData.row.relation,
        'workCompany': rowData.row.workCompany,
        'politicStatus': rowData.row.politicStatus
      }
      this.$refs.familyTable.validate((is) => {
        if (is) {
          this.$confirm('确定保存当前家庭成员信息么？', '提示', {
            cancelButtonText: '取消',
            confirmButtonText: '确定',
            type: 'warning'
          }).then(() => {
            if (parseInt(rowData.row.isUpdateFlag) === 1) { // 修改
              if (parseInt(this.userType) !== 1) { // 非学生
                let requestParams = Object.assign(rowData.row, {sn: this.sn})
                schoolService()._updateStudentFamilyMember(requestParams).then(res => {
                  if (res.status) {
                    this.$message.success('修改保存成功！')
                    this.familyTableData[rowData.$index].isUpdateFlag = 0
                  }
                })
              } else { // 其他角色
                studentService()._updateStudentFamilyMember(rowData.row).then(res => {
                  if (res.status) {
                    this.familyTableData[rowData.$index].isUpdateFlag = 0
                    this.$message.success('修改保存成功！')
                  }
                })
              }
            } else if (parseInt(rowData.row.isUpdateFlag) === 2) { // 新增
              if (parseInt(this.userType) !== 1) { // 非学生
                let requestParams = Object.assign(rowData.row, {sn: this.sn})
                schoolService()._saveStudentFamilyMember(requestParams).then(res => {
                  if (res.status) {
                    this.$emit('updateTableInfo')
                    this.$message.success('新增保存成功！')
                    this.familyTableData[rowData.$index].isUpdateFlag = 0
                  }
                })
              } else { // 其他角色
                studentService()._saveStudentFamilyMember(params).then(res => {
                  if (res.status) {
                    this.$emit('updateTableInfo')
                    this.familyTableData[rowData.$index].isUpdateFlag = 0
                    this.$message.success('新增保存成功')
                  }
                })
              }
            }
          }).catch(() => {

          })
        }
      })
    },
    // 删除家庭成员
    delCurrentFamily (rowData) {
      this.$confirm('确定删除当前家庭成员么？', '提示', {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning'
      }).then(() => {
        if (parseInt(rowData.row.isUpdateFlag) !== 2) {
          if (parseInt(this.userType) !== 1) { // 非学生
            schoolService()._delStudentFamilyMember(rowData.row.id).then(res => {
              if (res.status) {
                this.$message.success('删除成功！')
                this.$emit('updateTableInfo')
              }
            })
          } else { // 其他角色
            studentService()._studentDelFamilyMember(rowData.row.id).then(res => {
              if (res.status) {
                this.$message.success('删除成功！')
                this.$emit('updateTableInfo')
              }
            })
          }
        } else {
          this.familyTableData.splice(rowData.$index, 1)
        }
      }).catch(() => {

      })
    },
    addOrdelThisRule (inputKey, radioKey) {
      if (parseInt(this.familyData[radioKey]) === 1) {
        if (radioKey === 'isAccident') {
          this.familyRules[inputKey] = [{ required: true, message: '请输入家庭遭受突发意外事件', trigger: 'change' }]
        } else {
          this.familyRules[inputKey] = [{ required: true, message: '请输入近三年家庭遭受自然灾害', trigger: 'change' }]
        }
      } else {
        this.familyData[inputKey] = null
        this.$refs['familyData'].clearValidate([inputKey])
        this.familyRules[inputKey] = []
      }
    },
    submitForm (formName) {
      this.$refs[formName].validate((valid) => {
        this.$refs.familyTable.validate((validFamilyTable) => {
          if (valid && validFamilyTable) {
            if (this.familyTableData.length === 1 && this.familyTableData[0].isUpdateFlag !== 0) {
              this.$message.warning('请先保存家庭成员信息')
              return
            }
            if (this.familyTableData.length === 0) {
              this.$message.warning('请至少填写一名家庭成员信息')
              return
            }
            this.$confirm('确定保存当前信息？', '提示', {
              cancelButtonText: '取消',
              confirmButtonText: '确定',
              type: 'warning'
            }).then(() => {
              if (parseInt(this.userType) !== 1) { // 非学生
                let requestParams = Object.assign(this.familyData, {sn: this.sn})
                schoolService()._updateStudentFamilyInfo(requestParams).then(res => {
                  if (res.status) {
                    this.$message.success('保存成功！')
                    this.$emit('cancleUpdate')
                  }
                })
              } else { // 其他角色
                studentService()._updateStudentFamilyInfo(this.familyData).then(res => {
                  if (res.status) {
                    this.$message.success('保存成功')
                    this.$emit('cancleUpdate')
                  }
                })
              }
            }).catch(() => {

            })
          } else {
            this.$confirm('当前还有数据为空，请填写所有数据！', '提示', {
              cancelButtonText: '返回',
              showConfirmButton: false,
              type: 'warning'
            }).then(() => {

            }).catch(() => {

            })
            return false
          }
        })
      })
    },
    resetForm (formName) {
      // clearFormDataLocal('updateFamily')
      this.$refs[formName].resetFields()
      this.$emit('cancleUpdate')
    }
  }
}
</script>
<style lang="less" scoped>
.goback {
  padding: 0px 40px 15px 40px;
  a {
    color: #409eff;
  }
}
.el-select {
  width: 100%;
}
.titleH{
  font-size: 16px;
  margin-top: 10px;
  margin-bottom: 10px;
}
</style>
